import { getStorage, setStorage } from '@/utils/storage';
import { atom, selector } from 'recoil';

const defaultThemeConfig = getStorage<any>('themeConfig') || { primary: '#1890ff', bgColor: '#f0f2f5' };
export interface ThemeConfig {
    primary?: string;
    bgColor?: string;
}

export const defaultThemeConfigAtom = atom<ThemeConfig>({
    key: 'defaultThemeConfigAtom',
    default: defaultThemeConfig,
});

export const themeConfig = selector<ThemeConfig>({
    key: 'themeConfig',
    get: ({ get }) => {
        return get(defaultThemeConfigAtom);
    },
    set: ({ set }, newValue) => {
        let newThemeConfig = { ...defaultThemeConfig, ...newValue };
        set(defaultThemeConfigAtom, newThemeConfig);
        setStorage('themeConfig', newThemeConfig);
    },
});
